<template>
  <div class="count">
    <h3>MyCount组件</h3>
    <button >累加父组件给我的count</button>
    <button @click="addFn">查看组件实例</button>
    <p>子组件展示prop{{ count }}</p>
  </div>
</template>

<script>
export default {
  props:['count'],
  methods: {
    addFn() {
      /* 
      **报错** 
      原因:  vue和react一样都是单向数据流    高层次 流向 低层次
      子组件没办法修改父组件里的值  props都是只读属性
      
      */
      // this.count++  
      console.log(this);
      console.log(this.count);
      console.log(this.$props.count);
    }
  }
}
</script>

<style>
.count {
  background-color: rgb(237, 211, 216);
}
</style>